@charset "utf-8";

@import "reset";

$font-size:40;

@function r($px){
    @return $px/$font-size*1rem;
}

html,body{
    width: 100%;
    height: 100%;
    position: relative;
}

.web{
    width: 100%;
    height: 100%;
    position: absolute;
    background: url('../img/wedding-bg.jpg')no-repeat;
    background-size:100% ;
}

#backBtn{
    display: inline-block;
    width: r(41);
    height: r(41);
    position: absolute;
    right: r(56);
    bottom: r(25);
    img{
        width: 100%;
        height: 100%;
    }
}


.title{
    font-size:r(34);
    color: #e7c598;
    text-align: center;
    margin-top: r(264);
}
#inputmsg{
    margin-top: r(37);
}
.Input{
    width: r(407);
    height: r(38);
    background: #e7c598;
    border-radius: r(5);
    margin-left:r(113) ;
    margin-top: r(15);
   position: relative;
    label{
        display: inline-block;
        width: r(161);
        height: r(38);
        border-right: r(1) solid #c62e37;
        font-size: r(20);
        color: #bf0c21;
        line-height: r(38);
        text-align: center;
        position: absolute;
        left: 0;
        top: 0;
    }
    input{
        position: absolute;
        right: 0;
        top: r(5);
        appearance: none;
        -webkit-appearance: none;
        width: r(233);
        height: r(27);
        border: 0;
        background: #e7c598;
    }
}
.zhuyimsg{
    width: r(414);
    height: r(80);
    margin: 0 auto;
    margin-top: r(26);
    text-align: center;
    font-size: r(18);
    color: #e7c598;
}
#submitBtn{
    width: r(250);
    height: r(45);
    margin: 0 auto;
    margin-top: r(31);
    img{
        width: 100%;
        height: 100%;
    }
}


//失败弹窗
.pop-up-windows1{
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(123,2,7,.5);
    z-index: 99;
    display: none;
    .window-tc{
        width: r(413);
        height: r(250);
        background: url(../img/window-tc.png)no-repeat;
        position: absolute;
        background-size: 100%;
        left: r(115);
        top: r(356);
        .closeBtn1{
            width: r(36);
            height: r(36);
            position: absolute;
            right: r(18);
            top: r(11);
            img{
                width: 100%;
                height: 100%;
            }
        }
        .tc-msg{
           font-size: r(44);
           color: #bf0c21;
           text-align: center;
           margin-top: r(80);
        }
      
    }
    
}

//成功弹窗
.pop-up-windows2{
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(123,2,7,.5);
    z-index: 99;
    display: none;
    .window-tc{
        width: r(413);
        height: r(250);
        background: url(../img/window-tc.png)no-repeat;
        position: absolute;
        background-size: 100%;
        left: r(115);
        top: r(356);
        .closeBtn2{
            width: r(36);
            height: r(36);
            position: absolute;
            right: r(18);
            top: r(11);
            img{
                width: 100%;
                height: 100%;
            }
        }
        .tc-msg{
           font-size: r(44);
           color: #bf0c21;
           text-align: center;
           margin-top: r(80);
        }
         #checkBtn{
            display: inline-block;
            width: r(195);
            height: r(37);
            background: #bf0c21;
            color: #e7c598;
            text-align: center;
            border-radius: r(10);
            position: absolute;
            left: r(109);
            bottom: r(50);
            font-size: r(22);
            line-height: r(37);
        }
      
    }
    
}

.pop-up-windows3{
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(123,2,7,.5);
    z-index: 99;
    display: none;
    .window-tc{
        width: r(413);
        height: r(250);
        background: url(../img/window-tc.png)no-repeat;
        position: absolute;
        background-size: 100%;
        left: r(115);
        top: r(356);
        .closeBtn3{
            width: r(36);
            height: r(36);
            position: absolute;
            right: r(18);
            top: r(11);
            img{
                width: 100%;
                height: 100%;
            }
        }
        .tc-msg{
           font-size: r(44);
           color: #bf0c21;
           text-align: center;
           margin-top: r(80);
        }
      
    }
    
}

.pop-up-windows4{
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(123,2,7,.5);
    z-index: 99;
    display: none;
    .window-tc{
        width: r(413);
        height: r(250);
        background: url(../img/window-tc.png)no-repeat;
        position: absolute;
        background-size: 100%;
        left: r(115);
        top: r(356);
        .closeBtn4{
            width: r(36);
            height: r(36);
            position: absolute;
            right: r(18);
            top: r(11);
            img{
                width: 100%;
                height: 100%;
            }
        }
        .tc-msg{
           font-size: r(44);
           color: #bf0c21;
           text-align: center;
           margin-top: r(80);
        }  
    }   
}

.pop-up-windows5{
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(123,2,7,.5);
    z-index: 99;
    display: none;
    .window-tc{
        width: r(413);
        height: r(250);
        background: url(../img/window-tc.png)no-repeat;
        position: absolute;
        background-size: 100%;
        left: r(115);
        top: r(356);
        .closeBtn5{
            width: r(36);
            height: r(36);
            position: absolute;
            right: r(18);
            top: r(11);
            img{
                width: 100%;
                height: 100%;
            }
        }
        .tc-msg{
           font-size: r(44);
           color: #bf0c21;
           text-align: center;
           margin-top: r(80);
        }
      
    }
    
}

.pop-up-windows6{
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(123,2,7,.5);
    z-index: 99;
    display: none;
    .window-tc{
        width: r(413);
        height: r(250);
        background: url(../img/window-tc.png)no-repeat;
        position: absolute;
        background-size: 100%;
        left: r(115);
        top: r(356);
        .closeBtn6{
            width: r(36);
            height: r(36);
            position: absolute;
            right: r(18);
            top: r(11);
            img{
                width: 100%;
                height: 100%;
            }
        }
        .tc-msg{
           font-size: r(44);
           color: #bf0c21;
           text-align: center;
           margin-top: r(80);
        }
      
    }
    
}